// axios 的配置
import axios from 'axios'
// 引入 ElementUI 中的全局提示方法
import { MessageBox, Message, Loading } from 'element-ui'
// console.log(MessageBox)

// 引入进度条
import nprogress from 'nprogress'
import 'nprogress/nprogress.css'

// 对 axios 进行一些简单的配置
// axios 的公共配置
const http = axios.create({
  withCredentials: true, // 是否携带凭证
  baseURL: '/api', // 基础地址
  timeout: 5000 // 超时设置
})

// 请求拦截
// 假如有100个请求都需要携带相同的参数, 在api接口一个一个携带, 重复, 麻烦, 拦截器可以拦截到每一个请求, 然后进行添加参数, 写一次就行
http.interceptors.request.use(config => {
  // 打开进度条
  nprogress.start()
  // config 就是请求的对象, 里面可以拿到请求的地址 参数等
  // 获取在localStorage中存储的token
  let token = localStorage.getItem('yue-token')
  // 将token作为全局参数去请求数据 才能请求到数据
  if (token) config.headers.authorization = token
  // return config 理解为放行
  return config
})

// 响应拦截
// 可以在这个拦截器中处理一些公共的错误
http.interceptors.response.use(config => {
  // 停止进度条
  nprogress.done()
  // config 是响应对象, 里面可以拿到服务器响应的内容

  // return config  就是放行
  console.log('config===>', config)
  // 嵌套解构语法
  let {
    data: { state, msg, code, status }
  } = config

  // 10022 登入过期
  // 1004 token过期
  // 10026 没有权限
  // 页面重复导航死循环处理

  // 没有权限提示
  if (config.data.code === '10026') {
    MessageBox.alert('没有权限', '错误提示', { type: 'error' })
  }

  let codes = ['10022', '1004', '10026']
  if (codes.includes(code)) {
    // 清除token
    localStorage.removeItem('yue-token')
    // 刷新页面 清除token要刷新页面
    location.reload()
  }

  // 一个需要排除掉的不弹窗的接口
  let excludeUrl = ['/order/query_order_status']
  // 判断不需要弹出的这个数组中是否包含当前的请求的路径 如果包含就返回 true
  let isExclude = excludeUrl.includes(config.config.url)

  // 拦截判断后端响应的 state  编辑不做修改 status === 304 不弹框
  if (!state && !isExclude && status !== 304) {
    // 表示响应的是错误信息 全局提示
    MessageBox.alert(msg, '错误提示', { type: 'error' })
  }
  return config
})

export default http
